﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="jQueryUploadify.aspx.cs" Inherits="WebApplication.jQueryUploadify" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   <title>Uploadify</title>
    <link href="media/js/jquery.uploadify-v2.1.4/uploadify.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="media/js/jquery-1.4.min.js"></script>
    <script type="text/javascript" src="media/js/jquery.uploadify-v2.1.4/swfobject.js"></script>
    <script type="text/javascript" src="media/js/jquery.uploadify-v2.1.4/jquery.uploadify.v2.1.4.min.js"></script>

    <script type="text/javascript">
        $(document).ready(function () {
            $("#uploadify").uploadify({
                'uploader': 'media/js/jquery.uploadify-v2.1.4/uploadify.swf',
                'script': 'ServerAshxFile/JqueryUploadHandler.ashx?type=test',
                'cancelImg': 'media/js/jquery.uploadify-v2.1.4/cancel.png',
                'folder': 'media/upload/test',
                'queueID': 'fileQueue',
                'auto': false,
                'multi': true,
                'displayData': 'speed',
                'fileExt': '*.jpg;*.gif;*.png',
                'fileDesc': 'Image Files',
                'sizeLimit'   : 10240000,
                'onInit': function () { $('#id_message').html("上传就绪..."); },
                'onSelect': function (e, queueId, fileObj) {
                    $('#id_message').html("唯一标识:" + queueId + "\r\n" +
                          "文件名" + fileObj.name + "\r\n" +
                          "文件大小:" + fileObj.size + "Bytes \r\n" +
                          "文件类型:" + fileObj.type
                          );
                },
                'onAllComplete': function (event, data) {
                    $('#id_message').html("成功上传文件个数:" + data.filesUploaded + "\r\n" +
                          "上传总大小:" + data.allBytesLoaded + "Bytes \r\n" +
                          "平均速度:" + data.speed + " kb/s"
                          );
                }
            });
        });  
    </script>

</head>
<body>
    <div id="fileQueue"></div>
    <input type="file" name="uploadify" id="uploadify" />
    <br /><span id="id_message" style="background-color:#ffc; color:Red;"></span>
    <p>
        <a href="javascript:$('#uploadify').uploadifyUpload()">上传</a>| 
        <a href="javascript:$('#uploadify').uploadifyClearQueue()">取消上传</a>
    </p>
</body>
</html>
